// 入口函数
$(function () {
  // 1. 获取用户信息渲染头像
  getUserInfo()

  // 2. 退出功能
  $('#logout').on('click', function () {
    // layui里面的询问题，点击确定才会执行回调函数里面的代码
    layer.confirm('确认退出登录吗？', { icon: 3, title: '提示' }, function (
      index
    ) {
      // 销毁token，跳转登录页面
      location.href = '/login.html'
      localStorage.removeItem('token')

      // 自带代码，关系询问框
      layer.close(index)
    })
  })
})

// 2. 获取用户信息渲染头像封装成函数
// 要求:必须设置成全局函数,不是局部函数,后面要用
function getUserInfo () {
  // 发送ajax
  axios({
    method: 'get',
    url: '/my/userinfo'
    // 通过请求头设置 token 身份认证
    /* headers: {
      Authorization: localStorage.getItem('token')
    } */
  }).then(res => {
    //成功回调
    // console.log(res.data)

    if (res.data.status != 0) {
      return layui.layer.msg(res.data.message)
    }

    // 渲染
    renderAvatar(res.data.data)
  })
}

// 3. 渲染用户信息和头像
function renderAvatar (user) {
  // 渲染欢迎 - 如果又nickname优先渲染nickname,没有nickname渲染username
  // || 连接两个值,如果第一个值是false,返回第二个值,无论第二个值是什么
  // && 连接两个值,如果第一个值是false,直接返回
  let name = user.nickname || user.username

  $('.welcome').html('欢迎&nbsp;' + name)

  //处理头像:如果哟图片头像就渲染图片头像,否则渲染文字头像
  if (user.user_pic != null) {
    //   如果有图片头像渲染图片头像,隐藏文字头像,显示文字头像
    $('.text-avatar').hide()
    $('.layui-nav-img')
      .show()
      .attr('src', user.user_pic)
  } else {
    //   如果没有图片头像就渲染文字头像,隐藏图片头像,显示文字头像
    $('.layui-nav-img').hide()

    // 渲染name中的第一个字符,且是大写
    let first = name[0].toUpperCase()
    $('.text-avatar')
      .show()
      .html(first)
  }
}
